<template>
	<view>
		<!-- <view class="item" v-for="(item,index) in list" :key="index" @click="navigate(item)">
			<u-button type="primary" :text="item.text"></u-button>
		</view> -->

		<!-- #ifdef MP-WEIXIN -->
		<view class="header">
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view class="header header-top-h5">
				<!-- #endif -->
				<view class="head">
					<image style="width: 30rpx;height: 30rpx;"
						src="https://www.atuanjian.com/appletStatic/static/local.png" mode=""></image>
					<view class="local" @click="chooseCity()">
						<text>{{ currentCity.lastIndexOf('市') ? currentCity.replace(/市/, "") : currentCity }}</text>
						<view class="trang"></view>
					</view>
					<view class="search">
						<u-search @search="search()" placeholder="户外拓展/团建/骑行" :showAction="false" v-model="keyword">
						</u-search>
					</view>
				</view>
			</view>

			<!-- banner -->
			<view class="content">
				<view class="swiper">
					<u-swiper :list="banner" @change="e => currentNum = e.current" :autoplay="true" height="323rpx"
						imgMode="aspectFill" :circular="true" indicatorStyle="right: 20px">
						<view slot="indicator" class="indicator-num">
							<text class="indicator-num__text">{{ currentNum + 1 }}/{{ banner.length }}</text>
						</view>
					</u-swiper>
				</view>
				<!-- nav -->
				<view class="navBar">
					<swiper :indicator-dots="true" :autoplay="false" :interval="3000" :circular="true" :duration="1000">
						<swiper-item v-for="(item, index) in navList" :key="index">
							<view class="swiper-item" v-for="(item1, index1) in item" :key="index1"
								@click="toFound(item1)">
								<image
									:src="item1.applet_icon ? showImg + item1.applet_icon : 'https://www.atuanjian.com/appletStatic/static/fail.png'"
									mode="aspectFit"></image>
								<text>{{ item1.text }}</text>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<!-- 需求 -->
				<!-- <view class="demand-box">
					<view class="demand-top">
						<image src="https://www.atuanjian.com/appletStatic/static/images/u-06.svg" mode="" />
						<view class="xu">需求大厅</view>
						<view class="xian"></view>
						<view class="xu-1">已有33人提交需求</view>
						<view class="demand-button" @click="makeSure">立即提需求</view>
					</view>
					<view class="xian-1"></view>
					<swiper :indicator-dots="false" :vertical="true" :circular="true" :autoplay="true" :interval="2000"
						:duration="1000" class="swiper">
						<swiper-item v-for="(item, index) in 6" :key="index">
							<view class="swiper-item">
								<image src="https://www.atuanjian.com/appletStatic/static/images/u-10.png"
									alt="User Avatar" />刘先生136****4560提交了团购需求
							</view>
						</swiper-item>
					</swiper>
				</view> -->

				<!-- 定制 -->
				<!-- 	<view class="make">
				<image src="https://www.atuanjian.com/appletStatic/static/home/dz.png" mode="aspectFit"></image>
				<u-line direction="col" length="65rpx" ></u-line>
				 <swiper :indicator-dots="false" :vertical="true" :circular="true" :autoplay="true" :interval="2000" :duration="1000">
				 	<swiper-item v-for="(item,index) in 6" :key="index">
				 		<view class="swiper-item">刘先生136****4560提交了团购需求</view>
				 	</swiper-item> 
				 </swiper>
				<view class="add" @click="makeSure">一键定制</view>
			</view> -->
				<!-- 商品区 -->
				<view class="goods">
					<!-- 类型1 -->
					<!-- 当季主推 -->
					<view class="model1">
						<view class="good_header" @click="viewCase(0)">
							<view class="left">
								<text class="title">秒杀商品</text>
								<text class="des ip" v-if="indexPush">{{ indexPush['1_1'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height: 390rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in seasonList" :key="index"
									@click="caseDetail(item, 0)">
									<view class="img">
										<image :src="showImg + item.img" mode="aspectFill"></image>
										<text v-if="item.activity_type">{{ item.activity_type }}</text>
									</view>
									<view class="goods_tit">{{ item.title || '--' }}</view>
									<view class="notice">
										<text>{{ item.day_num || 0 }}</text>
										<u-line direction="col" length="20rpx" margin="0 6rpx 0 8rpx"></u-line>
										<text>{{ item.people_num || 0 }}</text>
									</view>
									<view class="flex">
										<view class="price">
											<span>￥</span><text>{{ item.people_price || 0 }}</text>{{
												item.people_price_unit || '' }}
										</view>
										<view class="car" @click.stop="addShop(item.id, 1)">
											<image src="https://www.atuanjian.com/appletStatic/static/images/u-car.png"
												mode=""></image>
										</view>
									</view>

								</view>
							</view>
						</scroll-view>
					</view>
					<!-- <view class="model1">
						<view class="good_header" @click="viewCase(0)">
							<view class="left">
								<text class="title">当季主推</text>
								<text class="des ip" v-if="indexPush">{{ indexPush['1_1'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height: 390rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in seasonList" :key="index"
									@click="caseDetail(item, 0)">
									<view class="img">
										<image :src="showImg + item.img" mode="aspectFill"></image>
										<text v-if="item.activity_type">{{ item.activity_type }}</text>
									</view>
									<view class="goods_tit">{{ item.title || '--' }}</view>
									<view class="notice">
										<text>{{ item.day_num || 0 }}</text>
										<u-line direction="col" length="20rpx" margin="0 6rpx 0 8rpx"></u-line>
										<text>{{ item.people_num || 0 }}</text>
									</view>
									<view class="flex">
										<view class="price">
											<span>￥</span><text>{{ item.people_price || 0 }}</text>{{
												item.people_price_unit || '' }}
										</view>
										<view class="car" @click.stop="addShop(item.id,1)">
											<image src="https://www.atuanjian.com/appletStatic/static/images/u-car.png"
												mode=""></image>
										</view>
									</view>

								</view>
							</view>
						</scroll-view>
					</view> -->
					<!-- 团建热卖 -->
					<view class="model1">
						<view class="good_header" @click="viewCase(1)">
							<view class="left">
								<text class="title">团建热卖</text>
								<text class="des ip" v-if="indexPush">{{ indexPush['2_1'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height: 420rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in teamMain" :key="index"
									@click="caseDetail(item, 1)" style="margin-bottom: 16rpx;">
									<view class="img">
										<image :src="showImg + item.img" mode="aspectFill"></image>
										<!-- <text>培训团建</text> -->
									</view>
									<view class="goods_tit">{{ item.title || '--' }}</view>
									<view class="notice">
										<text>{{ item.day_num || 0 }}</text>
										<u-line direction="col" length="20rpx" margin="0 6rpx 0 8rpx"></u-line>
										<text>{{ item.people_num || 0 }}</text>
									</view>
									<view class="flex">
										<view class="price">
											<span>￥</span><text>{{ item.people_price || 0 }}</text>{{
												item.people_price_unit || '' }}
										</view>
										<view class="car" @click.stop="addShop(item.id, 1)">
											<image src="https://www.atuanjian.com/appletStatic/static/images/u-car.png"
												mode=""></image>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 内训热卖 -->
					<view class="model1">
						<view class="good_header" @click="viewCase(2)">
							<view class="left">
								<text class="title">内训热卖</text>
								<text class="des"> </text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height: 420rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in trainMain" :key="index"
									@click="caseDetail(item, 2)">
									<view class="img">
										<image :src="showImg + item.img" mode="aspectFill"></image>
										<!-- <text>培训团建</text> -->
									</view>
									<view class="goods_tit">{{ item.title || '--' }}</view>
									<view class="notice">
										<text>{{ item.day_num || 0 }}</text>
										<u-line direction="col" length="20rpx" margin="0 6rpx 0 8rpx"></u-line>
										<text>{{ item.people_num || 0 }}</text>
									</view>
									<view class="flex">
										<view class="price">
											<span>￥</span><text>{{ item.people_price || 0 }}</text>{{
												item.people_price_unit || '' }}
										</view>
										<view class="car" @click.stop="addShop(item.id, 3)">
											<image src="https://www.atuanjian.com/appletStatic/static/images/u-car.png"
												mode=""></image>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 年会热卖 -->
					<view class="model1">
						<view class="good_header" @click="viewCase(3)">
							<view class="left">
								<text class="title">会议热卖</text>
								<text class="des"> </text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height: 420rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in meetingMain" :key="index"
									@click="caseDetail(item, 3)">
									<view class="img">
										<image :src="showImg + item.img" mode="aspectFill"></image>
										<!-- <text>培训团建</text> -->
									</view>
									<view class="goods_tit">{{ item.title || '--' }}</view>
									<view class="notice">
										<text>{{ item.day_num || 0 }}</text>
										<u-line direction="col" length="20rpx" margin="0 6rpx 0 8rpx"></u-line>
										<text>{{ item.people_num || 0 }}</text>
									</view>
									<view class="flex">
										<view class="price">
											<span>￥</span><text>{{ item.people_price || 0 }}</text>{{
												item.people_price_unit || '' }}
										</view>
										<view class="car" @click.stop="addShop(item.id, 2)">
											<image src="https://www.atuanjian.com/appletStatic/static/images/u-car.png"
												mode=""></image>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 场地优选 类型2 -->
					<view class="model2">
						<view class="good_header" @click="viewCase(4)">
							<view class="left">
								<text class="title">场地优选 </text>
								<text class="des ip" v-if="indexPush">{{ indexPush['3_4'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height:368rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in placeMain" :key="index"
									@click="caseDetail(item, 4)">
									<image :src="showImg + item.img" mode=""></image>
									<view class="mark">
										<text class="name">{{ item.title }}</text>
										<u-line direction="row" length="616rpx" color="#FFFFFF"></u-line>
										<scroll-view scroll-x="true" style="height: 34rpx;margin-top: 20rpx;">
											<view class="tipwrap">
												<view class="tips" v-for="(item1, index1) in item.features.split(',')"
													:key="index1">
													<text>{{ item1 }}</text>
													<u-line direction="col" margin="0 24rpx;" length="22rpx"
														color="#FFFFFF"></u-line>
												</view>
											</view>
										</scroll-view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 案例展示 类型3 -->
					<view class="model3">
						<view class="good_header" @click="viewCase(5)">
							<view class="left">
								<text class="title">案例展示</text>
								<text class="des ip" v-if="indexPush">{{ indexPush['4_5'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height:476rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in caseMain" :key="index"
									@click="caseDetail(item, 5)">
									<image :src="showImg + item.img" mode=""></image>
									<view class="titwrap">
										<view class="tit_name">{{ item.title }}</view>
										<view class="icon">
											<view class="iconwrap">
												<image src="https://www.atuanjian.com/appletStatic/static/home/a1.png"
													mode=""></image>
												<text>{{ item.people_num }}人</text>
											</view>
											<view class="iconwrap">
												<image src="https://www.atuanjian.com/appletStatic/static/home/a2.png"
													mode=""></image>
												<text>{{ item.activity_day }}</text>
											</view>
											<view class="iconwrap">
												<image src="https://www.atuanjian.com/appletStatic/static/home/a3.png"
													mode=""></image>
												<text>{{ item.place_title || '暂无信息' }}</text>
											</view>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 精彩视频 类型4 -->
					<view class="model4">
						<view class="good_header">
							<view class="left">
								<text class="title">精彩视频</text>
								<text class="des ip" v-if="indexPush">{{ indexPush['5_0'].push_title }}</text>
							</view>
							<image src="https://www.atuanjian.com/appletStatic/static/home/more.png"
								@click="viewVideoList()" mode=""></image>
						</view>
						<scroll-view scroll-x="true" style="height:404rpx;">
							<view class="wrap">
								<view class="item" v-for="(item, index) in videoMain" :key="index"
									@click="viewVideo(item)">
									<view class="video">
										<image class="video" :src="showImg + item.img" mode=""></image>
										<!-- <image class="play" src="https://www.atuanjian.com/appletStatic/static/play.png" mode=""></image> -->
										<!-- <rich-text :nodes="item.video_url"></rich-text> -->
									</view>
									<view class="tit_name">{{ item.title }}</view>
								</view>
							</view>
						</scroll-view>
					</view>
				</view>
				<!-- 团建动态 -->
				<view class="model5">
					<view class="good_header">
						<view class="left">
							<text class="title">团建动态</text>
							<text class="des ip" v-if="indexPush">{{ indexPush['6_0'].push_title }}</text>
						</view>
						<image @click="newsList()" src="https://www.atuanjian.com/appletStatic/static/home/more.png"
							mode=""></image>
					</view>
					<view class="nav">
						<text :class="{ active: navBarIndex == index }" v-for="(item, index) in newsMain" :key="index"
							@click="activeClick(index)">{{ item.title }}</text>
					</view>
					<view class="ul" v-if="newsMain.length > 0">
						<view class="li" v-for="(item, index) in newsMain[navBarIndex].news" :key="index"
							@click="newsDetail(item)">
							<view class="left">
								<image src="https://www.atuanjian.com/appletStatic/static/home/trang.png" mode="">
								</image>
								<view class="tit">{{ item.title }}</view>
							</view>
							<view class="right">{{ item.release_date.substring(0, 11) }}</view>
						</view>
						<u-empty v-if="newsMain[navBarIndex].news.length == 0" mode="data" :text="uEmptyText"
							icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>

				</view>
				<!-- 我们的优势 -->
				<view class="model6">
					<view class="title">我们的优势</view>
					<view class="desonly"> </view>
					<scroll-view scroll-x="true" style="height:372rpx;">
						<view class="wrap">
							<view class="wrap-box" v-for="(item, index) in advantageList" :key="index">
								<image :src="showImg + item.img" mode="aspectFit"></image>
								<view class="wrap-title">{{ item.title }}</view>
								<view class="wrap-titles">{{ item.title }}</view>
							</view>
						</view>
					</scroll-view>
					<!-- <swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" :circular="true">
						<swiper-item v-for="(item, index) in advantageList" :key="index">
							<view class="swiper-item">
								<view class="items">
									<image :src="showImg + item.img" mode="aspectFit"></image>
									<view class="info">
										<view class="sort">{{ item.title }}</view>
										<view class="type">{{ item.titles }}</view>
										<view class="des">{{ item.descr }}</view>
									</view>
								</view>
							</view>
						</swiper-item>

					</swiper> -->

				</view>

			</view>
			<view class="cat" @click="callPhone">
				<view class="cat_left">
					<text>蚂蚁团建</text>
					<text>不止工作，不止快乐</text>
				</view>
				<view class="cat_right">
					<text>联系我们</text>
					<text>13022861002</text>
				</view>
			</view>
			<!-- 悬浮小控件 -->
			<!-- <view class="tools">
				<view class="toolsWrap">
					<image @tap="showTool()" class="show" src="https://www.atuanjian.com/appletStatic/static/home/l.png" mode=""></image>
					<block>
						<view class="tool">
							<view class="item" @click="invite()">
							<image src="https://www.atuanjian.com/appletStatic/static/home/t4.png" mode=""></image>
							<text>邀请好友</text>
						</view>
						<view class="item" @click="buy()">
							<image src="https://www.atuanjian.com/appletStatic/static/home/t5.png" mode=""></image>
							<text>逛一逛</text>
						</view>
							<view class="item" @tap="consult">
								<image src="https://www.atuanjian.com/appletStatic/static/consult.png" mode=""></image>
								<text>咨询</text>
								<button type="default" open-type="contact"></button>
							</view>
							<view class="item" @click="callPhone()">
								<image src="https://www.atuanjian.com/appletStatic/static/phonecall.png" mode=""></image>
								<text>客服</text>
								<button type="default"></button>
							</view>
							<view class="item" @tap="scrollTop()">
								<image src="https://www.atuanjian.com/appletStatic/static/home/top.png" mode=""></image>
								<text>top</text>
							</view>
						</view>
					</block>
				</view>
			</view>
 -->

			<global-contact></global-contact>
			<!-- connect -->
			<!-- <view class="connect" v-show="show">
				<view class="item" @click="make">
					<image src="https://www.atuanjian.com/appletStatic/static/home/t1.png" mode=""></image>
					<text>定制方案</text>
				</view>
				<view class="item" @click="callPhone()">
					<image src="https://www.atuanjian.com/appletStatic/static/home/t2.png" mode=""></image>
					<text>立即致电</text>
				</view>
				<view class="item">
					<image src="https://www.atuanjian.com/appletStatic/static/home/t3.png" mode=""></image>
					<text>在线咨询</text>
					<button type="default" open-type="contact"></button>
				</view>
			</view> -->
			<u-picker :show="shows" :columns="columns" confirmColor="#FF9900" @cancel="cancel" @confirm="confirm">
			</u-picker>

			<u-picker :show="showCity" :columns="cityList" @cancel="cancel1" @confirm="confirm1"></u-picker>
			<u-overlay :show="showTip" @click="showTip = false">
				<view class="pop-box" @click="handleNav('/pagesB/login/login')">
					<view class="warp">
						<image :src="imgApi + 'images/wallet/icon-01.png'" mode="scaleToFill" />
						<view class="pop-tip">新人注册享好礼</view>
						<view class="pop-tip" style="padding-top: 8rpx;">{{ register_to_receive_bonus_points }}积分等您拿
						</view>
						<view class="pop-jif">{{ register_to_receive_bonus_points }} <span>积分</span></view>
					</view>
				</view>
			</u-overlay>
			<!-- tabBar -->
			<tabBar current='0'></tabBar>
		</view>
</template>

<script>
import tabBar from '@/components/tabBar.vue'
import {
	categoryIndex,
	seasonMain,
	seasonMainHot,
	meetingHot,
	placeChoice,
	caseShow,
	videoShow,
	newsShow,
	getBanner,
	annualMeeting,
	siteSetting,
	customList,
	pointsSetting,
	addCard
} from '@/utils/request.js'
// let mapsdk=null;
export default {
	data() {
		return {
			imgApi: this.$config.imgApi,
			register_to_receive_bonus_points: '',
			showTip: false,
			showCity: false,
			shows: false,
			columns: [
				['团建需求', '会议需求']
			],
			showImg: '',
			keyword: '',
			// banner
			currentNum: 0,
			banner: [],
			// nav
			navList: [],
			// 当季主推
			seasonList: [],
			// 团建热卖
			teamMain: [],
			// 内训热卖
			trainMain: [],
			// 年会热卖
			meetingMain: [],
			// 场地优选
			placeMain: [],
			// 案例展示
			caseMain: [],
			// 精彩视频
			videoMain: [],
			// 新闻动态
			newsMain: [],

			// 团建动态 新闻列表
			navBarIndex: 0,
			navBar: [{
				text: '公司新闻'
			}, {
				text: '行业动态'
			}, {
				text: '活动创意'
			}, {
				text: '活动攻略'
			},],
			// tools
			show: false,
			cityList: [],
			currentCity: '',
			advantageList: [],
			indexPush: null,
			uEmptyText: '数据加载中...',
			demands: [{
				user_id: '105****991',
				date: '12月27日',
				demand: '去威海的团建需求'
			},
			{
				user_id: '105****991',
				date: '10月27日',
				demand: '去威海的团建需求'
			},
			{
				user_id: '105****991',
				date: '10月27日',
				demand: '去威海的团建需求'
			},
			{
				user_id: '105****991',
				date: '12月27日',
				demand: '去威海的团建需求'
			},
			],
			currentIndex: 0,
			scrollIndex: 0,
			isScrolling: false,
		}
	},
	components: {
		tabBar
	},
	methods: {
		handleNav(url) {
			uni.navigateTo({ url: url })
		},
		async addCard(data) {
			return await addCard(data)
		},
		async pointsSetting() {
			return await pointsSetting()
		},
		async customList(data) {
			return await customList(data)
		},
		newsDetail(item) {
			uni.navigateTo({
				url: '/pagesA/detail/news?id=' + item.id
			})
		},
		newsList() {
			uni.navigateTo({
				// news
				url: '/pagesB/annualMeeting/newsList'
			})
		},
		makeSure() {
			// if(!uni.getStorageSync('userInfo')){
			// 	uni.showToast({
			// 		title:'请登录',
			// 		icon:'none'
			// 	})
			// 	return
			// }
			uni.navigateTo({
				url: '/pagesB/need/need?id=6'
			})
		},
		cancel1() {
			this.showCity = false
		},
		confirm1(event) {
			console.log('当前选中的值', event.value[0])
			uni.setStorageSync('webAddress', event.value[0])
			this.currentCity = event.value[0]
			this.defaultMethods()
			this.showCity = false
		},
		async siteSetting() {
			return await siteSetting()
		},
		getSetting() {
			this.siteSetting().then(res => {
				console.log('全局', res)
				uni.setStorageSync('webAddress', res.default_substation)
				this.currentCity = res.default_substation

				if (res.city && res.city.length > 0) {
					this.cityList.push(res.city)
				}
				if (res.advantage && res.advantage.length > 0) {
					this.advantageList = res.advantage
				}
				this.indexPush = res.indexPush
				this.defaultMethods()
			})
		},
		defaultMethods() {
			this.getCategory();
			this.getseason();
			this.getseasonHot({
				categoryId: 1
			}, 'product/party');
			this.getseasonHot({
				categoryId: 2
			}, 'training/party');
			this.getMeeting({
				categoryId: 3
			});
			this.getPlaceList({
				categoryId: 4
			});
			this.getCaseList({
				categoryId: 5
			});
			this.getVideoList({
				categoryId: 38
			});
			this.getNewsList();
			this.getImg()
			this.getList()
		},
		async annualMeeting(data) {
			return await annualMeeting(data)
		},
		getList() {
			let data = {
				catid: 3,
				p: 0,
				n: 6,
				typeId: '', //筛选分类字符串分割id ??????
				search: ''
			}
			this.annualMeeting(data).then(res => {
				// this.list=res.list
				this.meetingMain = res.list
				console.log(res)
				// console.log(this.category)
			}).catch(err => {
				console.log(err)
			})
		},
		cancel() {
			this.shows = false
		},
		confirm() {
			this.shows = false
		},
		// getBanner
		async getBanner(data) {
			return await getBanner(data)
		},
		getImg() {
			let data = {
				type: 2
			}
			this.getBanner(data).then(res => {
				console.log('banner', res)
				res.list.forEach(val => {
					this.banner.push(this.showImg + val.img)
				})

			})
		},
		// 首页category 轮播导航
		async categoryIndex() {
			return await categoryIndex()
		},
		removeUnwantedItems(menuItems) {
			return menuItems.filter(item => {
				if (item.child && item.child.length > 0) {
					item.child = removeUnwantedItems(item.child);
				}
				return ![36, 50, 49, 52].includes(item.id);
			});
		},
		getCategory() {
			this.categoryIndex().then(res => {
				const excludeTexts = ["团建项目", "会议物料", "内训精选", "少年培训"];
				// this.navList = [res.menu]
				this.navList =  [res.menu.filter(item => !excludeTexts.includes(item.text))];
			}).catch(err => {
				// console.log(err)
			})
		},
		// 当季主推
		async seasonMain() {
			return await seasonMain()
		},
		getseason() {
			this.seasonMain().then(res => {
				this.seasonList = res.list
				// console.log('当季主推',this.seasonList)
			}).catch(err => {
				// console.log(err)
			})
		},
		// 团建热卖 、内训热卖  seasonMainHot(data,url)
		async seasonMainHot(data, url) {
			return await seasonMainHot(data, url)
		},
		getseasonHot(data, url) {
			this.seasonMainHot(data, url).then(res => {
				if (data.categoryId == 1) {
					this.teamMain = res.list //团建热卖
				} else {
					this.trainMain = res.list //内训热卖
				}
			}).catch(err => {
				// console.log(err)
			})
		},
		// 年会热卖
		async meetingHot(data) {
			return await meetingHot(data)
		},
		getMeeting(data) {
			this.meetingHot(data).then(res => {
				// this.meetingMain=res.list
			}).catch(err => {
				// console.log(err)
			})
		},
		// 场地优选
		async placeChoice(data) {
			return await placeChoice(data)
		},
		getPlaceList(data) {
			this.placeChoice(data).then(res => {
				this.placeMain = res.list
			}).catch(err => {
				// console.log(err)
			})
		},
		// 案例展示
		async caseShow(data) {
			return await caseShow(data)
		},
		getCaseList(data) {
			this.caseShow(data).then(res => {
				this.caseMain = res.list
			}).catch(err => {
				// console.log(err)
			})
		},
		// 精彩视频
		async videoShow(data) {
			return await videoShow(data)
		},
		getVideoList(data) {
			this.videoShow(data).then(res => {
				console.log('res', res)
				this.videoMain = res
			}).catch(err => {
				// console.log(err)
			})
		},
		// 新闻动态
		async newsShow(data) {
			return await newsShow(data)
		},
		getNewsList(data) {
			this.newsShow(data).then(res => {
				console.log(res, 'newsShow')
				this.newsMain = res
			}).catch(err => {
				// console.log(err)
			})
		},

		chooseCity() {
			this.showCity = true
			// uni.showToast({
			// 	icon:'loading',
			// 	title:'正在研发中...'
			// })
		},
		// head search
		search() {
			if (!this.keyword.trim()) {
				uni.showToast({
					icon: 'none',
					title: '请输入关键词',
					duration: 2000
				})
			} else {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/product?keywords=${this.keyword}&id=1`
				})
			}
		},
		// 查看案例
		viewCase(index) {
			if (index == 0) {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/product?id=1`
				})
			} else if (index == 1) {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/product?id=1`
				})
			} else if (index == 2) {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/training?id=2`
				})
			} else if (index == 3) {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/meeting?id=3`
				})
			} else if (index == 4) {
				uni.navigateTo({
					url: '/pagesB/annualMeeting/place?id=4'
				})
			} else if (index == 5) {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/case?id=5`
				})
			}


		},
		caseDetail(item, index) {
			if (index == 0) {
				// uni.showToast({
				// 	icon:'loading',
				// 	title:'正在研发中...',
				// 	duration:2000
				// })
				uni.navigateTo({
					url: `/pagesA/detail/product?id=${item.id}`
				})
			} else if (index == 1) {
				uni.navigateTo({
					url: `/pagesA/detail/product?id=${item.id}`
				})
			} else if (index == 2) {
				uni.navigateTo({
					url: `/pagesA/detail/training?id=${item.id}`
				})
			} else if (index == 3) {
				uni.navigateTo({
					url: `/pagesA/detail/meeting?id=${item.id}`
				})
			} else if (index == 4) {
				// uni.showToast({
				// 	icon:'loading',
				// 	title:'正在研发中...',
				// 	duration:2000
				// })

				uni.navigateTo({
					url: `/pagesA/detail/place?id=${item.id}`
				})
			} else if (index == 5) {
				uni.navigateTo({
					url: `/pagesA/detail/case?id=${item.id}`
				})
			}
		},
		activeClick(index) {
			if (this.navBarIndex != index) {
				this.navBarIndex = index
			}
		},
		// 视频列表
		viewVideoList() {
			uni.navigateTo({
				url: `/pages/videoList/videoList?id=38`
			})
		},
		// 查看视频
		viewVideo(item) {
			let json = encodeURIComponent(JSON.stringify(item))
			uni.navigateTo({
				url: `/pages/videoList/detail?params=${json}`
			})
		},
		// 轮播 nav list  此处跳转不完整 待补充 ？？？
		toFound(item) {
			console.log(item)
			if (item.cat_url == 'case') {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/case?id=${item.id}&title_text=${item.text}`
				})
			} else if (item.text == '传媒') {
				uni.navigateTo({
					url: `/pages/videoList/videoList?id=38&title_text=${item.text}`
				})
			} else if (item.text == '定制') {
				// if(!uni.getStorageSync('userInfo')){
				// 	uni.showToast({
				// 		title:'请登录',
				// 		icon:'none'
				// 	})
				// 	return
				// }
				uni.navigateTo({
					url: `/pagesA/need/need?id=6&title_text=${item.text}`
				})
			} else if (item.text == '关于我们') {
				uni.navigateTo({
					url: `/pages/mine/about?id=37&title_text=${item.text}`
				})
			} else if (item.text == '项目精选') {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/selection?id=${item.id}&title_text=${item.text}`
				})
			} else if (item.text == '青少年') {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/youth?id=${item.id}&title_text=${item.text}`
				})
			} else if (item.text == '方案') {
				uni.navigateTo({
					url: `/pagesB/scheme/index?id=${item.id}&title_text=${item.text}`
				})
			} else if (item.text == '项目') {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/project`
				})
			} else {
				uni.navigateTo({
					url: `/pagesB/annualMeeting/${item.cat_url}?id=${item.id}&title_text=${item.text}`
				})
			}
			// if(item.text=='团建'){

			// }else if(item.text=='会议'){
			// 	uni.navigateTo({
			// 		url:`/pages/annualMeeting/meeting?id=${item.id}`
			// 	})
			// }else if(item.text=='场地'){
			// 	uni.navigateTo({
			// 		url:`/pages/annualMeeting/place?id=${item.id}`
			// 	}) 
			// }else if(item.text=='案例'){
			// 	uni.navigateTo({
			// 		url:`/pages/annualMeeting/case?id=${item.id}`
			// 	})
			// }else{
			// 	uni.showToast({
			// 		icon:'loading',
			// 		title:'正在研发中...',
			// 		duration:2000
			// 	})
			// } 
		},
		// 底部 功能
		showTool() {
			this.show = !this.show
		},
		// 制作方案
		make() {
			// if(!uni.getStorageSync('userInfo')){
			// 	uni.showToast({
			// 		title:'请登录',
			// 		icon:'none'
			// 	})
			// 	return
			// }
			uni.navigateTo({
				url: '/pagesA/need/need?id=6'
			})
			// this.shows=true
			// uni.showToast({
			// 	icon:'loading',
			// 	title:'正在研发中...',
			// 	duration:2000
			// })
		},
		addShop(id, type) {
			if (!uni.getStorageSync('userInfo')) {
				uni.showToast({
					title: '请先登录',
					icon: 'none'
				})
				return uni.navigateTo({ url: '/pagesB/login/login' })
			}
			const data = { user_id: JSON.parse(uni.getStorageSync('userInfo')).id, product_id: id, type: type }
			this.addCard(data).then(res => {
				uni.showToast({
					title: '添加成功'
				})
			})
		},
		// 打电话
		callPhone() {
			uni.makePhoneCall({
				phoneNumber: '13022861002'
			})
		},
		// 邀请
		invite() {
			uni.showToast({
				icon: 'loading',
				title: '正在研发中...',
				duration: 2000
			})
		},
		// 逛一逛
		buy() {
			uni.showToast({
				icon: 'loading',
				title: '正在研发中...',
				duration: 2000
			})
		},
		// 置顶
		scrollTop() {
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 500
			})
		},

		consult() {
			// #ifdef H5
			window.open(
				'https://p.qiao.baidu.com/cps3/chatIndex?siteToken=7e191e5d3cefa6a8c6871fce24f7376d&speedLogId=159462572466489c0_1594625724664_51120&eid=30623379&reqParam=%7B%22from%22%3A0%2C%22sid%22%3A%22-100%22%2C%22tid%22%3A%22-1%22%2C%22ttype%22%3A1%2C%22siteId%22%3A%2215082789%22%2C%22userId%22%3A%2230623379%22%2C%22pageId%22%3A0%7D'
			);
			// #endif
		},

		// 位置授权获取
		// getAuthorizeInfo(){
		// 	const that = this;
		// 	uni.authorize({
		// 		scope: 'scope.userLocation',
		// 		success() { // 允许授权
		// 			that.getLocationInfo();
		// 		},
		// 		fail(){    // 拒绝授权
		// 			that.openConfirm();
		// 			// console.log("你拒绝了授权，无法获得周边信息")
		// 		}
		// 	})
		// },
		// 获取地理位置
		// getLocationInfo(){  
		// 	let that=this;
		// 	uni.getLocation({
		// 		type: 'wgs84',
		// 		success (res) {
		// 			console.log('当前位置信息',res);
		// 			// res.longitude
		// 			// res.latitude
		// 			// that.WXmap.reverseGeocoder({
		// 			// 	location:{
		// 			// 		latitude:res.latitude,
		// 			// 		longitude:res.longitude
		// 			// 	},
		// 			// 	success:res=>{
		// 			// 		// console.log('逆转地址',res.result.address_component)
		// 			// 	}
		// 			// })
		// 		}
		// 	});
		// },
		// 再次获取授权
		// 当用户第一次拒绝后再次请求授权
		// openConfirm(){
		// 	uni.showModal({
		// 		title: '请求授权当前位置',
		// 		content: '需要获取您的地理位置，请确认授权',
		// 		success: (res)=> {
		// 			if (res.confirm) {
		// 				uni.openSetting();// 打开地图权限设置
		// 			} else if (res.cancel) {
		// 				uni.showToast({
		// 					title: '你拒绝了授权，无法获得周边信息',
		// 					icon: 'none',
		// 					duration: 2000
		// 				})
		// 			}
		// 		}
		// 	});
		// },

	},
	onLoad() {
		this.showImg = this.$config.showImgApi;
		this.getSetting()
		if (!uni.getStorageSync('userInfo')) {
			this.pointsSetting().then(res => {
				this.register_to_receive_bonus_points = res.register_to_receive_bonus_points.values
				this.showTip = false
			})
		}
	},
	onShow() {
		// this.getAuthorizeInfo(); 
	},
	onShareAppMessage() {

	}
}
</script>

<style lang="scss" scoped>
.pop-box {
	position: relative;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;

	.warp {
		width: 550rpx;
		height: 696rpx;
		position: relative;

		image {
			width: 550rpx;
			height: 696rpx;
			position: absolute;
			top: 0;
			left: 0;
		}

		.pop-tip {
			padding-top: 262rpx;
			text-align: center;
			font-size: 52rpx;
			color: #FFFFFF;
			position: relative;
			z-index: 9;
		}

		.pop-jif {
			text-align: center;
			margin-top: 28rpx;
			font-size: 85rpx;
			font-weight: bold;
			color: #ee5121;
			position: relative;
			z-index: 9;

			span {
				font-size: 48rpx;
				font-weight: 500;
			}
		}
	}
}

.demand-box {
	width: 648rpx;
	padding: 16rpx 24rpx;
	background: #FFFFFF;
	border-radius: 16rpx;
	box-shadow: 3rpx 3rpx 10rpx rgba(255, 187, 80, 0.16);
	margin: 0px auto 0;

	.xian-1 {
		width: 100%;
		height: 1rpx;
		box-shadow: 3rpx 3rpx 10rpx rgba(255, 187, 80, 0.16);
		background-color: #D7D7D7;
		margin-top: 30rpx;
	}

	.swiper {
		margin-top: 30rpx;
		height: 50rpx;
	}

	.swiper-item {
		font-size: 22rpx;
		display: flex;
		align-items: center;

		image {
			width: 30rpx;
			height: 30rpx;
			margin-right: 16rpx;
		}
	}

	.demand-top {
		display: flex;
		align-items: center;

		image {
			width: 40rpx;
			height: 38rpx;
			margin-top: 10rpx;
		}

		.xu {
			font-size: 28rpx;
			color: #FFBB50;
			padding: 0rpx 20rpx 0 10rpx;
		}

		.xu-1 {
			font-size: 22rpx;
			color: #FFBB50;
			margin-left: 16rpx;
			flex: 1;
			overflow: hidden;
		}

		.xian {
			width: 1rpx;
			height: 30rpx;
			background: #D7D7D7;
		}

		.demand-button {
			font-size: 20rpx;
			color: #FFFFFF;
			padding: 12rpx 16rpx;
			display: flex;
			align-items: center;
			text-align: center;
			background-color: #FFBB50;
			border-radius: 16rpx;
		}
	}

	.demand-list {
		width: 100%;
		margin-top: 20rpx;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;

		/* Firefox */
		&::-webkit-scrollbar {
			display: none;
			/* Chrome/WebKit */
		}

	}
}

.wrap {
	@include flex_style(flex-start, center, row nowrap);
	white-space: nowrap;

	.wrap-box {
		width: 327rpx;
		margin-right: 30rpx;

		image {
			width: 347rpx;
			height: 264rpx;
		}

		.wrap-title {
			font-size: 30rpx;
			font-weight: 700;
			margin-top: 12rpx;
			text-align: center;
		}

		.wrap-titles {
			text-align: center;
			font-size: 20rpx;
		}
	}
}

.indicator-num {
	padding: 4rpx 18rpx 6rpx;
	background-color: rgba(0, 0, 0, 0.35);
	border-radius: 22rpx;
	width: 80rpx;
	@include flex;
	justify-content: center;

	&__text {
		color: #FFFFFF;
		font-size: 26rpx;
	}
}

.header {
	background: #FFB850;
	width: 750rpx;
	height: 88rpx;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 90;

	.head {
		@include flex_style(space-between, center, row nowrap);
		padding: 16rpx 22rpx 16rpx 30rpx;

		.local {
			@include flex_style(flex-start, center, row nowrap);

			text {
				display: block;
				max-width: 85rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				font-size: 28rpx;
				font-family: 苹方-简;
				font-weight: normal;
				line-height: 38rpx;
				color: #FFFFFF;
			}

			.trang {
				width: 0;
				height: 0;
				border-left: 7rpx solid transparent;
				border-right: 7rpx solid transparent;
				border-top: 10rpx solid #FFFFFF;
				margin-left: 8rpx;
			}
		}

		.search {
			// width: 580rpx;
			width: 550rpx;
			height: 56rpx;

			::v-deep .u-search__content {
				background-color: #F5F5F5 !important;
				border-width: 0;
			}

			::v-deep .u-search__content__input {
				height: 56rpx !important;
				background-color: #F5F5F5 !important;
				border-width: 0;
			}
		}
	}
}

.content {
	padding-top: 88rpx;
	padding-bottom: 20rpx;

	.navBar {
		padding: 40rpx;

		swiper {
			height: 500rpx;

			swiper-item {
				@include flex_style(flex-start, center, row wrap);

				.swiper-item {
					@include flex_style(flex-start, center, column wrap);
					margin-bottom: 34rpx;
					// margin-right: 52rpx;
					width: 20%;

					image {
						width: 92rpx;
						height: 92rpx;
					}

					text {
						font-size: 28rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 38rpx;
						color: #333333;
						white-space: nowrap;
					}
				}

				.swiper-item:nth-child(5n) {
					margin-right: 0;
				}
			}

			/* 默认指示点的样式 */
			.wx-swiper-dot {
				background-color: #F5F5F5;
				position: relative;
				bottom: -20rpx;
			}

			/* 选中指示点的样式 */
			.wx-swiper-dot.wx-swiper-dot-active {
				background-color: #FF9900;
			}
		}
	}

	.make {
		width: 690rpx;
		height: 108rpx;
		box-sizing: border-box;
		margin: 0 auto;
		padding: 16rpx 34rpx 18rpx 20rpx;
		background: rgba(255, 255, 255, 0.39);
		border: 1rpx solid #F2F2F2;
		box-shadow: 0px 6rpx 6rpx rgba(168, 168, 168, 0.16);
		border-radius: 8rpx;
		@include flex_style(space-between, center, row nowrap);

		image {
			width: 100rpx;
			height: 74rpx;
		}

		swiper {
			width: 316rpx;
			height: 70rpx;

			.swiper-item {
				width: 330rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				font-size: 20rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				line-height: 70rpx;
				color: #999999;
			}
		}

		.add {
			width: 144rpx;
			height: 56rpx;
			border-radius: 28rpx;
			background-color: #F76422;
			text-align: center;
			line-height: 56rpx;
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #FFFFFF;
		}
	}

	.goods {
		padding-left: 30rpx;

		.model1 {
			margin-top: 58rpx;

			.good_header {
				padding-right: 30rpx;
				margin-bottom: 40rpx;
				@include flex_style(space-between, center, row nowrap);

				.left {
					text {
						display: block;
					}

					.title {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: bold;
						line-height: 56rpx;
						color: #1A1A1A;
						margin-bottom: 8rpx;
					}

					.des {
						font-size: 26rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 34rpx;
						color: #888888;
					}
				}

				image {
					width: 40rpx;
					height: 40rpx;
				}
			}

			scroll-view {
				.wrap {
					@include flex_style(flex-start, center, row nowrap);
					white-space: nowrap;

					.item {
						width: 316rpx;
						background: rgba(255, 255, 255, 0.39);
						box-shadow: 0px 6rpx 20rpx rgba(155, 155, 155, 0.24);
						border-radius: 8rpx;
						margin-right: 24rpx;
						padding-bottom: 16rpx;

						.img {
							position: relative;
							margin-bottom: 12rpx;

							image {
								width: 316rpx;
								height: 192rpx;
							}

							text {
								display: inline-block;
								padding: 0 8rpx;
								line-height: 40rpx;
								background: linear-gradient(150deg, #FF9900 0%, #FFAB2C 100%);
								opacity: 0.9;
								border-radius: 8rpx 0px 8rpx 0px;
								position: absolute;
								top: 0;
								left: 0;
								z-index: 20;
								font-size: 22rpx;
								font-family: 苹方-简;
								font-weight: normal;
								color: #FFFFFF;
							}
						}

						.goods_tit {
							width: 276rpx;
							height: 70rpx;
							font-size: 25rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: #1A1A1A;
							@include word_over(2);
							white-space: normal;
							margin: 0 auto 8rpx;
						}

						.notice {
							padding: 0 20rpx;
							margin-bottom: 6rpx;
							@include flex_style(flex-start, center, row nowrap);

							text {
								font-size: 22rpx;
								font-family: 苹方-简;
								font-weight: normal;
								line-height: 30rpx;
								color: #888888;
							}
						}

						.flex {
							display: flex;
							justify-content: space-between;
							width: 276rpx;
							padding-top: 16rpx;
							margin: 0 auto;

							.car {
								width: 50rpx;
								height: 50rpx;
								background-color: #F59A23;
								border-radius: 50%;
								@include flex_style(center, center, row nowrap);

								image {
									width: 29rpx;
									height: 27rpx;
								}
							}
						}

						.price {
							font-size: 20rpx;
							font-family: 苹方-简;
							font-weight: normal;
							line-height: 28rpx;
							color: #888888;
							padding-right: 20rpx;
							padding-bottom: 16rpx;
							text-align: right;

							span {
								font-size: 20rpx;
								color: #F59A23;
							}

							text {
								font-size: 28rpx;
								line-height: 40rpx;
								color: #F59A23;
							}
						}
					}
				}
			}
		}

		.model2 {
			margin-top: 58rpx;

			.good_header {
				padding-right: 30rpx;
				margin-bottom: 40rpx;
				@include flex_style(space-between, center, row nowrap);

				.left {
					text {
						display: block;
					}

					.title {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: bold;
						line-height: 56rpx;
						color: #1A1A1A;
						margin-bottom: 8rpx;
					}

					.des {
						font-size: 26rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 34rpx;
						color: #888888;
					}
				}

				image {
					width: 40rpx;
					height: 40rpx;
				}
			}

			scroll-view {
				.wrap {
					@include flex_style(flex-start, center, row nowrap);
					white-space: nowrap;

					.item {
						width: 640rpx;
						height: 368rpx;
						position: relative;
						margin-right: 24rpx;
						box-shadow: 0px 6rpx 20rpx rgba(155, 155, 155, 0.24);

						image {
							width: 640rpx;
							height: 100%;
						}

						.mark {
							width: 640rpx;
							height: 160rpx;
							background: linear-gradient(93deg, rgba(0, 0, 0, 0.36) 0%, rgba(0, 0, 0, 0.14) 100%);
							position: absolute;
							bottom: 48rpx;
							left: 0;
							box-sizing: border-box;
							padding: 20rpx 0 22rpx 26rpx;

							.name {
								display: block;
								white-space: nowrap;
								overflow: hidden;
								text-overflow: ellipsis;
								margin-bottom: 22rpx;
								font-size: 30rpx;
								font-family: PingFang SC;
								font-weight: bold;
								line-height: 42rpx;
								color: #FFFFFF;
							}

							.tipwrap {
								@include flex_style(flex-start, center, row nowrap);
								white-space: nowrap;

								.tips {
									@include flex_style(flex-start, center, row nowrap);

									text {
										font-size: 26rpx;
										font-family: 苹方-简;
										font-weight: normal;
										line-height: 34rpx;
										color: #FFFFFF;
									}
								}
							}
						}
					}
				}
			}
		}

		.model3 {
			margin-top: 58rpx;

			.good_header {
				padding-right: 30rpx;
				margin-bottom: 40rpx;
				@include flex_style(space-between, center, row nowrap);

				.left {
					text {
						display: block;
					}

					.title {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: bold;
						line-height: 56rpx;
						color: #1A1A1A;
						margin-bottom: 8rpx;
					}

					.des {
						font-size: 26rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 34rpx;
						color: #888888;
					}
				}

				image {
					width: 40rpx;
					height: 40rpx;
				}
			}

			.wrap {
				@include flex_style(flex-start, center, row nowrap);
				white-space: nowrap;

				.item {
					width: 640rpx;
					// height: 360rpx;
					position: relative;
					margin-right: 22rpx;
					border: 2rpx solid #F5F5F5;

					image {
						width: 640rpx;
						height: 360rpx;
					}

					.titwrap {
						padding: 16rpx 20rpx 20rpx 16rpx;

						.tit_name {
							width: 604rpx;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
							margin-bottom: 8rpx;
							font-size: 26rpx;
							font-family: PingFang SC;
							font-weight: bold;
							line-height: 40rpx;
							color: #1A1A1A;
						}

						.icon {
							@include flex_style(space-between, center, row nowrap);

							.iconwrap {
								@include flex_style(flex-start, center, row nowrap);

								image {
									width: 32rpx;
									height: 32rpx;
									margin-right: 4rpx;
								}

								text {
									font-size: 22rpx;
									font-family: 苹方-简;
									font-weight: normal;
									line-height: 30rpx;
									color: #888888;
								}
							}
						}
					}
				}
			}

		}

		.model4 {
			margin-top: 58rpx;

			.good_header {
				padding-right: 30rpx;
				margin-bottom: 40rpx;
				@include flex_style(space-between, center, row nowrap);

				.left {
					text {
						display: block;
					}

					.title {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: bold;
						line-height: 56rpx;
						color: #1A1A1A;
						margin-bottom: 8rpx;
					}

					.des {
						font-size: 26rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 34rpx;
						color: #888888;
					}
				}

				image {
					width: 40rpx;
					height: 40rpx;
				}
			}

			.wrap {
				@include flex_style(flex-start, center, row nowrap);
				white-space: nowrap;

				.item {
					width: 640rpx;
					margin-right: 24rpx;

					.video {
						width: 640rpx;
						height: 320rpx;
						position: relative;

						.play {
							width: 96rpx;
							height: 96rpx;
							position: absolute;
							top: 0;
							right: 0;
							bottom: 0;
							left: 0;
							z-index: 20;
							margin: auto;
						}
					}

					.tit_name {
						width: 608rpx;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						padding: 20rpx 12rpx 26rpx 20rpx;
						background-color: #F5F5F5;
						font-size: 28rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 38rpx;
						color: #333333;
					}
				}
			}
		}
	}

	.model5 {
		margin-top: 58rpx;
		padding: 0 30rpx;

		.good_header {
			padding-right: 30rpx;
			margin-bottom: 42rpx;
			@include flex_style(space-between, center, row nowrap);

			.left {
				text {
					display: block;
				}

				.title {
					font-size: 40rpx;
					font-family: PingFang SC;
					font-weight: bold;
					line-height: 56rpx;
					color: #1A1A1A;
					margin-bottom: 8rpx;
				}

				.des {
					font-size: 26rpx;
					font-family: 苹方-简;
					font-weight: normal;
					line-height: 34rpx;
					color: #888888;
				}
			}

			image {
				width: 40rpx;
				height: 40rpx;
			}
		}

		.nav {
			@include flex_style(flex-start, center, row nowrap);
			background-color: #E9E9E9;

			text {
				flex: 1;
				text-align: center;
				line-height: 72rpx;
				font-size: 28rpx;
				font-family: 苹方-简;
				font-weight: normal;
				color: #666666;
			}

			.active {
				background-color: #FF9900;
				color: #FFFFFF;
			}
		}

		.ul {
			.li {
				@include flex_style(space-between, center, row nowrap);
				margin-top: 28rpx;

				.left {
					@include flex_style(flex-start, center, row nowrap);

					image {
						width: 20rpx;
						height: 24rpx;
						margin-right: 16rpx;
					}

					.tit {
						width: 450rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						font-size: 24rpx;
						font-family: 苹方-简;
						font-weight: normal;
						line-height: 32rpx;
						color: #333333;
					}
				}

				.right {
					font-size: 24rpx;
					font-family: 苹方-简;
					font-weight: normal;
					line-height: 32rpx;
					color: #666666;
				}
			}
		}
	}

	.model6 {
		margin-top: 64rpx;
		padding: 0 30rpx 1rpx;

		.title {
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			line-height: 56rpx;
			color: #1A1A1A;
		}

		.items {
			background: rgba(255, 255, 255, 0.39);
			box-shadow: 0px 6rpx 20rpx rgba(155, 155, 155, 0.24);
			border-radius: 8rpx;
			margin-top: 40rpx;
			width: 690rpx;
			box-sizing: border-box;
			padding: 20rpx;
			@include flex_style(space-between, center, row nowrap);

			image {
				width: 240rpx;
				height: 240rpx;
				border-radius: 8rpx;
			}

			.info {
				width: 375rpx;

				.sort {
					font-size: 24rpx;
					font-family: 苹方-简;
					font-weight: normal;
					line-height: 32rpx;
					color: #888888;
					margin-bottom: 6rpx;
				}

				.type {
					font-size: 32rpx;
					font-family: 苹方-简;
					font-weight: normal;
					line-height: 42rpx;
					color: #333333;
					margin-bottom: 38rpx;
				}

				.des {
					width: 375rpx;
					height: 76rpx;
					line-height: 38rpx;
					font-size: 24rpx;
					font-family: 苹方-简;
					font-weight: normal;
					color: #888888;
					overflow: hidden;

					text-overflow: ellipsis;

					display: -webkit-box;

					-webkit-box-orient: vertical;

					-webkit-line-clamp: 2;
				}
			}
		}

		.items:nth-child(2n-1) {
			flex-direction: row-reverse;
		}
	}
}

// .tools {
// 	position: fixed;
// 	bottom: 180rpx;
// 	right: 0;
// 	z-index: 999;

// 	.toolsWrap {
// 		@include flex_style(flex-start, center, row nowrap);

// 		.show {
// 			width: 22rpx;
// 			height: 460rpx;
// 		}

// 		.tool {
// 			background: rgba(0, 0, 0, 0.7);
// 			width: 120rpx;
// 			height: 350rpx;
// 			@include flex_style(space-around, center, column nowrap);

// 			.item {
// 				position: relative;
// 				width: 90rpx;
// 				@include flex_style(flex-start, center, column nowrap);

// 				image {
// 					width: 52rpx;
// 					height: 52rpx;
// 					margin-bottom: 4rpx;
// 				}

// 				text {
// 					font-size: 20rpx;
// 					font-family: 苹方-简;
// 					font-weight: normal;
// 					line-height: 28rpx;
// 					color: #FFFFFF;
// 				}

// 				button {
// 					position: absolute;
// 					top: 0;
// 					left: 0;
// 					width: 100%;
// 					height: 100%;
// 					opacity: 0;
// 				}
// 			}
// 		}
// 	}
// }

.connect {
	position: fixed;
	bottom: 200rpx;
	left: 0;
	right: 0;
	z-index: 999;
	margin: auto;
	width: 240rpx;
	@include flex_style(flex-end, center, column nowrap);

	.item {
		width: 240rpx;
		height: 72rpx;
		@include flex_style(center, center, row nowrap);
		margin-top: 24rpx;
		border-radius: 38rpx;
		background: rgba(0, 0, 0, 0.7);
		position: relative;

		image {
			width: 40rpx;
			height: 40rpx;
			margin-right: 6rpx;
		}

		text {
			font-size: 28rpx;
			font-family: 苹方-简;
			font-weight: normal;
			line-height: 72rpx;
			color: #FF9900;
		}

		button {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			opacity: 0;
		}
	}
}

.desonly {
	font-size: 26rpx;
	font-family: 苹方-简;
	font-weight: normal;
	line-height: 34rpx;
	color: #888888;
	margin-top: 8rpx;
}

.cat {
	background-color: rgba(245, 245, 245, .6);
	padding: 20rpx 0;
	margin-top: 20rpx;
	@include flex_style(center, center, row nowrap);
	font-weight: bold;

	.cat_left {
		@include flex_style(flex-start, flex-start, column nowrap);
		margin: 0 60rpx;
		font-size: 28rpx;
		font-family: 苹方-简;
		font-weight: normal;

		text {
			color: rgb(220, 220, 220)
		}

		text:nth-child(1) {
			font-size: 40rpx;
		}

		text:nth-child(2) {
			margin-top: 10rpx;
		}
	}

	.cat_right {
		@include flex_style(flex-start, flex-start, column nowrap);
		margin: 0 60rpx;
		font-size: 26rpx;
		font-family: 苹方-简;
		font-weight: normal;

		text {
			color: rgb(220, 220, 220)
		}

		text:nth-child(2) {
			margin-top: 10rpx;
		}
	}
}

.ip {
	width: 630rpx !important;
}

.fix-box {
	position: fixed;
	width: 40px;
	height: 40px;
}

.go-top {
	bottom: 40px;
}

.contact-us {
	bottom: 80px;
}
</style>